import React, { useEffect, useState } from "react";
import axios from "axios";
import { Table, Switch, Button } from "antd";

const Index = () => {
  // 容器
  const [list, setList] = useState([]);
  // 请求函数
  const fetchList = () => {
    axios.get("/api/list").then((resp) => {
      setList(resp.data.data);
    });
  };
  // 列
  const columns = [
    {
      title: "id",
      dataIndex: "id",
      key: "id",
    },
    {
      title: "姓名",
      dataIndex: "name",
      key: "name",
    },
    {
      title: "开始时间",
      dataIndex: "createTime",
      key: "createTime",
    },
    {
      title: "备注",
      dataIndex: "tip",
      key: "tip",
    },
    {
      title: "状态",
      dataIndex: "state",
      key: "state",
      render(params) {
        if(params) return <Switch defaultChecked></Switch>
        else return <Switch></Switch>
      }
    },
    {
      title: '操作',
      key: 'eolrfkwel',
      render() {
        return <Button type="primary" danger>删除</Button>
      }
    }
  ];
  // 副作用
  useEffect(() => {
    fetchList();
  }, []);
  return (
    <div>
      <Table dataSource={list} columns={columns}></Table>
    </div>
  );
};

export default Index;
